<!DOCTYPE html>
<html lang="en">
	<head>
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
		<meta charset="utf-8" />
		
		<title>{{page.title}} - {{site.title}}</title>	
		<meta name="description" content="{{page.description}}" />
		
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
		
		{{> layout._template.styles}}{{! there are also some scripts as well }}
	</head>

	<body class="no-skin">
	{{> layout.navbar}}

		<div class="main-container" id="main-container">
		 <script type="text/javascript">
		 try{ace.settings.check('main-container' , 'fixed')}catch(e){}
		 </script>

		 {{> layout.sidebar}}

			<div class="main-content">
			  {{^page.no-breadcrumbs}}{{!show breadcrumbs only if a "no-breadcrumbs" variable is "NOT" defined}}
				{{> layout.breadcrumbs}}
			  {{/page.no-breadcrumbs}}

				<div class="page-content">
					{{> layout.settings}}

				   <div class="page-content-area">
					{{^page.no-header}}{{!if no such thing as "no-header", then print header}}
					<div class="page-header">
						<h1>{{page.title}} {{#page.description}}<small><i class="ace-icon fa fa-angle-double-right"></i> {{page.description}}</small>{{/page.description}}</h1>
					</div><!-- /.page-header -->
					{{/page.no-header}}

					<div class="row">
					 <div class="col-xs-12">
<!-- PAGE CONTENT BEGINS -->
{{> page.content }}
<!-- PAGE CONTENT ENDS -->
					 </div><!-- /.col -->
					</div><!-- /.row -->
				   </div><!-- /.page-content-area -->

				</div><!-- /.page-content -->
			</div><!-- /.main-content -->
			
			{{> layout.footer}}


			<a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse">
				<i class="ace-icon fa fa-angle-double-up icon-only bigger-110"></i>
			</a>
		</div><!-- /.main-container -->

		{{> layout._template.scripts}}
	</body>
</html>
